<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JavaScript异步编程</title>
    <script src="./js/js09_oojs_09.js" async></script>
    <link rel="stylesheet" href="./style/common.css">
</head>
<body>
    <h1>Promise——JavaScript异步编程基础</h1>
    <p class="msg"></p>
</body>
<script>
    document.addEventListener("DOMContentLoaded",function(){
        let msg=document.querySelector(".msg");

        //使用Promise对象
        myPromise.then(
            res=>{
                msg.innerHTML+=`${res.msg}:${res.value}<br>`
            },
            err=>{
                msg.innerHTML+=`${err.msg}:${err.value}<br>`;
                msg.classList.add("danger");
            }
        );

        //Promise链式访问:then()返回Promise对象
        myPromise.then((res)=>{
            msg.innerHTML+=`${res.msg}:${res.value}<br>`;
            return res;
        }).then((res)=>{
            console.log(`promise链式调用：${res.msg}`);
            return 10;
        }).then((data)=>{
            console.log(`Promise链式调用：${data}`);
        }).catch((err)=>{
            msg.innerHTML+=`${err.msg}:${err.value}<br>`;
                msg.classList.add("danger");
        });
    });
</script>
</html>